<style lang="less">
.title-text span {
  display: block; /*设置为块级元素会独占一行形成上下居中的效果*/
  position: relative; /*定位横线（当横线的父元素）*/

  color: black; /*居中文字的颜色*/
  font-weight: bold;
  text-align: center;
}

.title-text span:before,
.title-text span:after {
  content: "";
  position: absolute; /*定位背景横线的位置*/
  top: 50%;
  background: #dfdfdf; /*背景横线颜色*/
  width: 44%; /*单侧横线的长度*/
  height: 1px;
}

.title-text span:before {
  left: 0; /*调整背景横线的左右距离*/
}

.title-text span:after {
  right: 0;
}
</style>
<template >

  <div class="search" style="background-color: rgb(255,255,255)">
    <Row style="margin-top: 1%;">
      <i-col offset="19">
        <Button @click="handleBack" :size="buttonSize" label="large" type="primary" style="margin-right: 24px;" >返回</Button>
        <Button @click="handleCommit('dataForm')" v-if="this.modalType != 3" :size="buttonSize" label="large"
          type="primary" style="margin-right: 24px;" >提交</Button>
        <!-- <Button @click="handle('dataForm')" v-if="this.modalType != 3" :size="buttonSize" label="large"
          type="primary">保存</Button> -->
      </i-col>
    </Row>
    <div class="addInfo" style="display: block" id="thirdCompany">
      <h2 class="title-text"><span id="gkType">{{name}}</span></h2>
      <Row style="margin-top: 1%;border: 1px solid #dcdee2; border-color: #e8eaec;    margin: 8px;">
        <Form ref="dataForm" :model="dataForm" :rules="ruleValidate" :label-width="140">
          <Row style="padding-top: 11px">
            <i-col span="12">
              <FormItem label="黑名单类型" prop="blacklistType" style="margin-left: 40%">
                <Select v-model="dataForm.blacklistType" disabled placeholder="请选择" size="default" style="width: 200px">
                  <Option value="01">合作商</Option>
                  <Option value="02">挂靠单位</Option>
                  <Option value="03">见证人</Option>
                  <Option value="04">开票方</Option>
                  <Option value="05">车商</Option>
                </Select>
              </FormItem>
            </i-col>
            <i-col span="12">
              <FormItem label="名称" prop="blackName" style="margin-left: 10%">
                <Input type="text" size="default" v-model="dataForm.blackName" clearable placeholder="请输入"
                  style="width: 200px" />
              </FormItem>
            </i-col>

          </Row>
          <Row>
            <i-col span="12">
              <FormItem label="证件类型" prop="idType" style="margin-left: 40%">
                <Select v-model="dataForm.idType" disabled placeholder="请选择" size="default" style="width: 200px">
                  <Option value="01">身份证</Option>
                  <Option value="02">统一社会信用代码</Option>
                  <Option value="03">纳税人识别号</Option>
                </Select>
              </FormItem>
            </i-col>
            <i-col span="12">
              <Form-item label="申请加入时间" prop="createTime" style="margin-left: 10%">
                <Date-picker type="date" size="default" disabled :value="dataForm.createTime" @on-change="dataForm.createTime=$event" placeholder="选择日期"
                  style="width: 200px"></Date-picker>
              </Form-item>
            </i-col>

          </Row>

          <Row>
            <i-col span="12">
              <Form-item label="证件号码" prop="idCode" style="margin-left: 40%">
                <Input type="text" size="default" v-model="dataForm.idCode" clearable placeholder="请输入"
                  style="width: 200px;" />
              </Form-item>
            </i-col>
            <i-col span="12" v-if="dataForm.blacklistType=='05'">
              <FormItem label="车辆类型" prop="carDealers" style="margin-left: 10%">
                <Select v-model="dataForm.carDealers" placeholder="请选择" size="default" style="width: 200px">
                  <Option value="01">普通车商</Option>
                  <Option value="02">直营车商</Option>
                </Select>
              </FormItem>
            </i-col>

          </Row>
          <Row>
            <i-col span="12">
              <Form-item label="黑名单原因" prop="blacklistReason" style="margin-left: 40%">
                <Input type="textarea" maxlength="200" size="default" v-model="dataForm.blacklistReason" :rows="4" placeholder="请输入" />

              </Form-item>
            </i-col>

            <!-- <i-col span="12">

              <Button @click="openFileUpload" size="large"
                style=" float: right;margin-right: 60%;color: #2b85e4;   background-color:white;border: none">上传附件</Button>

            </i-col> -->
          </Row>

        </Form>
      </Row>
    </div>
    <!-- <div>
      <Button @click="handleBack" size="large"
        style=" float: right; margin-right: 55%;  background-color: rgb(0,153,102);color:white;">返回</Button>
      <Button @click="handleCommit('dataForm')" size="large"
        style="float: right; margin-right: -15%;   background-color: rgb(0,153,102);color:white;">提交</Button>
    </div> -->
  </div>

</template>

<script>
import { save } from "@/projects/afs-channel/api/black/black";
import * as utils from "@/projects/afs-apply/assets/js/utils";
import timeUtils from "@/libs/util.js";
export default {
  name: "user-manage",
  components: {},
  data() {
    const validatePassword = (rule, value, callback) => {
      if(this.dataForm.blacklistType=="03"){
         utils.doValidID(rule, value, callback);
      }else{
        // 先判断只能有字母和数字
        var  dd =/^[0-9a-zA-Z]+$/;
        if(!dd.test(value)){
           callback(new Error("只能有英文和数字"));
        }
         callback();
      }
    };

    return {
      buttonSize: "large",
      loading: true,
      modalType: 0,

      name:"",

      dataForm: {
        blacklistType: null, // 黑名单类型 01-合作商 02-挂靠单位 03-见证人04-开票方 05-车商
        blackName: null, // 名称
        idType: null, // 证件类型 01-身份证 02-统一信用证代码 03 纳税人识别号
        idCode: null, // 证件号码
        createTime: null, // 创建时间
        blacklistReason: null, // 加入黑名单原因

        carDealers: "01" //仅车商可以用：01:普通车商02直营车商
      },

      // 下面用于表单必填验证
      ruleValidate: {
        blacklistType: [
          { required: true, message: "请选择黑名单类型", trigger: "blur" }
        ],

        blackName: [{ required: true, message: "请输入名称", trigger: "blur" }],
        idType: [{ required: true, message: "请输入类型", trigger: "blur" }],
        idCode: [
          { required: true, message: "请输入证件号", trigger: "blur" },
          { validator: validatePassword, trigger: "blur" }
        ],
        blacklistReason: [
          { required: true, message: "请输入原因", trigger: "blur" }
        ]
      },
      submitLoading: false,
      total: 0
    };
  },
  methods: {
    init() {
      console.log(this.afs.getPageParams(this).blacklistType);
      this.dataForm.blacklistType = this.afs.getPageParams(this).blacklistType;
      if (this.dataForm.blacklistType == "03") {
        this.dataForm.idType = "01";
        this.name="见证人"
      } else if (this.dataForm.blacklistType == "04") {
        this.dataForm.idType = "03";
        this.name="开票方"
      } else if (this.dataForm.blacklistType == "01") {
        this.dataForm.idType = "02";
        this.name="合作商"
      } else if (this.dataForm.blacklistType == "02") {
        this.dataForm.idType = "02";
        this.name="挂靠单位"
      } else if (this.dataForm.blacklistType == "05") {
        this.dataForm.idType = "02";
        this.name="车商"
      }
      this.getTime();
    },

    // 点击返回
    handleBack() {
      this.afs.closeTab(this);
    },
    // 点击提交
    handleCommit(name) {
     
      this.$refs[name].validate(valid => {
        console.log(valid);
        if (valid) {
          //  this.dataForm.createTime = timeUtils.formatDate(this.dataForm.createTime, 'YYYY-MM-DD hh:mm:ss');
          // 黑名单录入
          if (this.dataForm.blacklistType != "05") {
            this.dataForm.carDealers = null;
          }
          this.dataForm.idCode=this.dataForm.idCode.replace(/\s*/g,"");
          this.dataForm.blackName=this.dataForm.blackName.replace(/\s*/g,"");
          this.dataForm.blacklistReason=this.dataForm.blacklistReason.replace(/\s*/g,"");
          save(this.dataForm)
            .then(res => {
              if (res.code === "0000") {
                this.$Message.success("申请成功！");
                // 先关闭页面
                this.afs.closeTab(this);
                // 再跳转页面
                
              }
            })
            .catch(() => {});
        } else {
          this.$Message.error("请补全信息");
        }
      });
    },
    // 切换类型
    clickType(type) {
      // 黑名单类型 01-合作商 02-挂靠单位 03-车商 04-见证人 05-开票方
      this.dataForm.blacklistType = type;
      if (type == "01") {
        this.dataForm.idType = "02";
      }
      if (type == "02") {
        this.dataForm.idType = "02";
      }
      if (type == "03") {
        this.dataForm.idType = "01";
      }
      if (type == "04") {
        this.dataForm.idType = "03";
      }
      if (type == "05") {
        this.dataForm.idType = "02";
      }
      this.dataForm.blackName = null; // 名称
      this.dataForm.idCode = null; // 证件号码
      this.dataForm.blacklistReason = null; // 加入黑名单原因
    },
    // 上传文件页面
    openFileUpload() {
      console.log(this.isShowFile);
      this.isShowFile = !this.isShowFile;
    },

    // 获取当前时间
    getTime() {
      var date = new Date();
      var year = date.getFullYear(); //年 ,从 Date 对象以四位数字返回年份
      var month = date.getMonth() + 1; //月 ,从 Date 对象返回月份 (0 ~ 11) ,date.getMonth()比实际月份少 1 个月
      var day = date.getDate(); //日 ,从 Date 对象返回一个月中的某一天 (1 ~ 31)
      var hours = date.getHours(); //小时 ,返回 Date 对象的小时 (0 ~ 23)
      var minutes = date.getMinutes(); //分钟 ,返回 Date 对象的分钟 (0 ~ 59)
      var seconds = date.getSeconds(); //秒 ,返回 Date 对象的秒数 (0 ~ 59)
      //修改月份格式
      if (month >= 1 && month <= 9) {
        month = "0" + month;
      }
      //修改日期格式
      if (day >= 0 && day <= 9) {
        day = "0" + day;
      }
      //修改小时格式
      if (hours >= 0 && hours <= 9) {
        hours = "0" + hours;
      }
      //修改分钟格式
      if (minutes >= 0 && minutes <= 9) {
        minutes = "0" + minutes;
      }
      //修改秒格式
      if (seconds >= 0 && seconds <= 9) {
        seconds = "0" + seconds;
      }
      console.log("年" + year);
      //格式(yyyy-mm-dd hh:mm:ss)
      var currentFormatDate =
        year +
        "-" +
        month +
        "-" +
        day +
        " " +
        hours +
        ":" +
        minutes +
        ":" +
        seconds;
      this.dataForm.createTime = currentFormatDate;
      console.log(currentFormatDate);
    }
  },
  // 初始化加载
  mounted() {
    this.init();
  }
};
</script>
